/**
 * ajax异步网络封装思路
 *   - 为什么要封装,重复的代码做封装，提高效率
 *   - 将不变的代码封装到函数中,将变化的内容做参数传入函数
 *    
 *    提取变化的内容
 *       - 请求方法     method:  POST|GET
 *       - 请求url地址  url:  http://10.7.162.74:8088/api/user/add
 *       - 请求参数     data
 *            区分get|post
 * 
 *       - 响应业务逻辑处理
 *               function(){}
 * 
 */

function myAjaxPromise(options) {
    return new Promise(function (resolve, reject) {
        //封装Ajax
        //1. 获取XMLHttpRequest
        const xhr = new window.XMLHttpRequest()
        //格式化参数
        let parms = formatParma(options.data)
        if (options.method.toUpperCase() == 'GET') {
            //2. 建立连接
            xhr.open(options.method, options.url + '?' + parms) //http://ip:port/login?username='admin'&age=21
            xhr.send()
        } else if (options.method.toUpperCase() == 'POST') {
            xhr.open(options.method, options.url)
            //3.发送请求
            //设置传输的参数数据类型content-type, 支持名称1=值1&名称2=值2
            xhr.setRequestHeader('content-type', 'application/x-www-form-urlencoded')
            xhr.send(parms)
        }
        //4.处理响应数据
        xhr.onreadystatechange = function () {
            if (xhr.readyState == 4) {
                if (xhr.status == 200) {
                    let result = xhr.responseText
                    result = JSON.parse(result) //json字符串转json对象
                    resolve(result)
                } else {
                    reject(xhr.status)
                }
            }
        }
    })
}

/**
 let obj=  {
     username:'admin',
     age:21,            =>   `username='admin' & age=21& headerimg="http://222.jpg"
     headrimg:''
   }  
   遍历对象
      for(let key in obj){
         // key, obj[key]
      }
 */
function formatParma(obj) {
    let arr = []
    for (let key in obj) {
        let item = `${key}=${obj[key]}` //username='admin'
        arr.push(item) //[username='admin', age=21,headerimg="http://222.jpg"]
    }
    let str = arr.join('&') //`username='admin' & age=21& headerimg="http://222.jpg"
    return str
}